<template>
  <div>
    <MyTable :arr="list"></MyTable>
    <MyTable :arr="list">
      <!-- scope: {row: obj} -->
      <template v-slot="scope">
        <a :href="scope.row.headImgUrl">{{ scope.row.headImgUrl }}</a>
      </template>
    </MyTable>
    <MyTable :arr="list">
      <template v-slot="scope">
        <img style="width: 100px;" :src="scope.row.headImgUrl" alt="">
      </template>
    </MyTable>
  </div>
</template>

<script>
import MyTable from "../components/06/MyTable";
export default {
  components: {
    MyTable,
  },
  data() {
    return {
      list: [
        {
          name: "使用方法1",
          age: 18,
          headImgUrl:
            "https://img-blog.csdnimg.cn/img_convert/3286561104a700e1b8b3facdf05ff355.png",
        },
        {
          name: "使用方法2",
          age: 25,
          headImgUrl:
            "https://img-blog.csdnimg.cn/img_convert/1062ccbdac7e6be134a6eb3d2951011c.png",
        },
        {
          name: "使用方法3",
          age: 21,
          headImgUrl:
            "https://img-blog.csdnimg.cn/img_convert/99304cf6f38725e09fa1d29100121729.png",
        },
      ],
    };
  },
};
</script>

<style>

</style>